<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Component-Demo</title>
    <script src="https://unpkg.com/vue@next"></script>
    <!-- 防抖 -->
    <script src="https://unpkg.com/lodash@4.17.20/lodash.min.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script>
</head>
<body>
    <div id="body">
        <button-demo name="12">点击1</button-demo>
        <button-demo name="abd">点击1 </button-demo>
        <button-demo>点击1</button-demo>
    </div>
</body>
<script>
    const Prams = {

    }
    Vue.createApp(Prams)
        .component('button-demo', {
            props:['name'],
            data() {
                return{
                    count: 0
                }
            },
            template: `
                <button @click="count++">
                  You clicked me {{ count }} times. name - {{ name }}
                </button>`
        })
        .mount("#body")
</script>
</html>